<template>
  <div>
   
    <van-nav-bar
  title="商品分类"

  left-arrow
  @click-left="onClickLeft"
  @click-right="onClickRight"
/>
<div class="top">
  <van-search
  v-model="v"
  show-action
  
  placeholder="请输入搜索关键词"
  @search="onSearch"
>
  <template #action>
    <div class="pic">
      <img src="https://static.asus.com.cn/static/wap/app/images/gallery/button_navibars_2b.png" alt="">
    </div>
    
    <!-- <div @click="onSearch">搜索</div> -->
  </template>
</van-search>
      
    </div>
<div class="left">
  <van-sidebar v-model="activeKey">
  <van-sidebar-item title="ROG 20" />
  <van-sidebar-item title="高效轻薄本" />
  <van-sidebar-item title="游戏本送豪礼"/>
  <van-sidebar-item title="电脑组件"/>
  <van-sidebar-item title="网络/外设/周边"/>
  <van-sidebar-item title="台式机"/>
  <van-sidebar-item title="ProArt"/>
</van-sidebar>
</div>
  </div>
  
</template>

<script>
export default {
  data() {
    return {
      activeKey: 0,
      onSearch:'',
      v:''
    };
  },
  methods: {
    onClickLeft() {
      
    },
    onClickRight() {
    
    },
  },

}
</script>

<style scoped>
.pic img{
  width: 1.6875rem;
  height: 1.6875rem;
}
 .van-search{
 line-height: 27px;
  
 }



</style>